
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head> 
  <base href="<%=basePath%>">
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
  <title>订单管理</title>
	<link rel="stylesheet" href="../../../files/css/layui.css" media="all">
  <style>
    body{margin: 10px;}
    .demo-carousel{height: 300px; line-height: 300px; text-align: center;}
  </style>
</head>
<body>
	<div class="demoTable">
	  搜索用户：
	  <div class="layui-inline">
	    <input class="layui-input" name="memName" id="memName" autocomplete="off">
	  </div>
	  <button class="layui-btn" data-type="reload">搜索</button>
	</div> 
	<table class="layui-hide" id="test" lay-filter="demo"></table>
	<div id="ss" style="position: fixed; left: 0px; top: 0px; width: 100%; height: 100%; opacity: 0.5; background: rgb(0, 0, 0); z-index: 1000;display:none;"></div>
	<div id="dd" style="position: fixed; left: 5%; top: 30%; z-index: 1001;display:none;">
		<table class="layui-table">
		  <colgroup>
		    <col width="150">
		    <col width="200">
		    <col width="200">
		    <col>
		  </colgroup>
		  <thead>
		    <tr>
		      <th>菜品名称</th>
		      <th>数量</th>
		      <th>单价</th>
		      <th>加入时间</th>
		    </tr> 
		  </thead>
		  <tbody id="tbody">
		    
		  </tbody>
		</table>
		<div class="addressform-buttons">
			<button onclick="none()">确定</button>
		</div>
	</div> 
 
<script type="text/html" id="barDemo"> 
  <a class="layui-btn layui-btn-xs" lay-event="del" id="imgUpdate">修改</a>
  <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="edit">查看</a>
</script>
<script type="text/html" id="switchIsva">
	 
	{{ panduan(d) }}
</script> 
<script type="text/html" id="switchIsva">
	<input type="checkbox" name="ifNull"  value="{{d.colNo}}" lay-skin="switch" lay-text="T|F" lay-filter="ifNullDemo" {{ d.notNull == 'T' ? 'checked' : '' }}>

</script> 

<script src="../../../files/js/layui.js"></script> 
<script src="../../../commom/js/base.js"></script>
<script type="text/javascript">

function none(){
	document.getElementById("ss").style.display="none";
	document.getElementById("dd").style.display="none";
}
</script>
<script>
 
layui.use(['laydate', 'laypage', 'layer', 'table', 'upload', 'element'], function(){
  var laydate = layui.laydate //日期
  ,laypage = layui.laypage //分页
  layer = layui.layer //弹层
  ,table = layui.table //表格
  ,upload = layui.upload //上传
  ,element = layui.element; //元素操作
 
  
  //执行一个 table 实例
  table.render({
     elem: '#test'
    ,height: 473
    ,url: getRootPath()+'order/orderAll.action' //数据接口
    ,page: true //开启分页
    ,method:'post'
    ,cols: [[ //表头
       {type:'checkbox', fixed: 'left'}
      ,{field: 'shopName', title: '店铺名称', width:140, fixed: 'left'}
      ,{field: 'memName', title: '客户名称', width:170,align:'center'}
      ,{field: 'orderTime', title: '下单时间', width: 170,align:'center'} 
      ,{field: 'orderState', title: '订单数量', width: 113,align:'center',}
      ,{field: 'orderMoney', title: '金额', width: 80,align:'center',} 
      ,{field: 'oper', title: '操作人', width: 150,align:'center',}
      ,{field: 'isva', title: '订单状态', width: 120,align:'center',templet:'#switchIsva', unresize : true}
      ,{field: 'sort', title: '排序', width: 100,align:'center',} 
      ,{fixed: 'right',title: '操作', width: 165, align:'center', toolbar: '#barDemo'}
    ]]
  	,id: 'testReload'
  	,done:function(res,curr,count){
  		$("[data-field='imgId']").css('display','none');
  	}
  });
  
  //监听工具条
  table.on('tool(demo)', function(obj){ //注：tool是工具条事件名，test是table原始容器的属性 lay-filter="对应的值"
    var data = obj.data //获得当前行数据
    ,layEvent = obj.event; //获得 lay-event 对应的值
   // alert(data);
    if(layEvent === 'del'){
    	var id=data.orderId; //得到当前行ID
        layer.confirm('确认派送？', function(index){
          	layer.close(index);
            //使用jquery的ajax方式向后台提交数据
	  		var url = getRootPath()+'order/Update.action';
	  		var data={orderId:id};
  			$.post(url,data,function(data){
  				  obj.update(); //删除对应行（tr）的DOM结构
  				if(data.num>0){
  					layer.msg(data.msg, {
					  icon: 1,
					  time: 1000 //1秒关闭（如果不配置，默认是3秒）
					}, function(){
  							
					});
				}
  				location.reload();
  			},"JSON");
        });
    } else if(layEvent === 'edit'){
    	$("#ss").show();
		$("#dd").show();
    	var id=data.orderId;
        alert("这里 "+id);
        //使用jquery的ajax方式向后台提交数据
		var url = getRootPath()+'orderCare/findById.action';
		var data={orderId:id};
		$.post(url,data,function(mes){
			for(var i =0 ;i<mes.length;i++){
				$("#tbody").append('<tr>'
					+ '<td>'+mes[i].menuName+'</td>'
					+ '<td>'+mes[i].careNum+'</td>'
					+ '<td>'+mes[i].careMoney+'</td>'
					+ '<td>'+mes[i].careTime+'</td>'
				+ '</tr>');
			}   
		},"JSON");
    } 
  });
  
  //条件查询
  //获取jquery的$
  var $ = layui.$;
		  
  $('.demoTable .layui-btn').on('click', function(){
	 var demoReload = $('#memName');
	 //执行重载
     table.reload('testReload', {
       page: {
         curr: 1 //重新从第 1 页开始
       }
       ,where: {
    	   memName: demoReload.val()
       }
     });
  });
  $('#imgAdd').on('click', function(){
	 layer.open({
		  type: 2,
		  area : ['60%' , '90%'],//弹出框大小
		  shift:1,//弹出框动画效果
		  content: ['add.html','on'] //这里content是一个URL，如果你不想让iframe出现滚动条，你还可以content: ['http://sentsin.com', 'no']
		}); 
   });
});
//是否有效
function panduan(d){
	  var html="";
	  if(d.isva==0){
		  html='<a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="shenhe">未派送</a>';
	  }else if(d.isva>0){
		  html='<a class="layui-btn layui-btn-xs" >已派送</a>';
	  } 
	  return html ;
}
  //是否有效
</script>
</body>
</html>   